<template>
	<view>
		
		<view class="input_list">
			<view class="text">真实姓名</view>
			<input type="text" value="" placeholder="请输入真实姓名" v-model="name"/>
		</view>
		<view class="input_list">
			<view class="text">身份证号</view>
			<input type="text" value="" placeholder="请输入身份证号码" v-model="card"/>
		</view>
		
		<view class="content">
		  <view class="title">请上传你的身份证照片</view>
		  <view class="sfz_box">
		  <block  >
		    <view class="sfz"  @tap="openImg1">
		      <image :src="s1" mode=""></image>
		      <view class="menu02">拍摄正面</view>
		    </view>
			<view class="sfz"  @tap="openImg2">
			  <image :src="s2" mode=""></image>
			  <view class="menu02">拍摄反面</view>
			</view>
		  </block>
		    <!-- <view class="sfz">
		      <image src="../../images/zj02.png" mode="widthFix"></image>
		      <view class="menu02">拍摄反面</view>
		    </view> -->
		  </view>
		</view>
		
		<view class="tips">您的信息仅供本平台使用，请您放心填写</view>
		

		<button class="confirm" @tap='login'>完成</button>
	</view>
</template>

<script>
	import { pathToBase64, base64ToPath } from '../../common/image-tools.js'
	import Cfg from '../../common/config.js';
export default {
	data() {

		return {
			s1:'../../static/zj01.png',
			s2: '../../static/zj02.png',
			s11:'',
			s22: '',
			name:'',
			card:'',
			
			
			
		};
	},
	onLoad() {
			var that = this;
		that.Net._get('smshcx',{},(res)=>{
			if(res.code ==1){
		     if(res.data.sm_name)that.name=res.data.sm_name
			 if(res.data.sm_card)that.card=res.data.sm_card
			 if(res.data.sm_z)
			 {
				 that.s1= Cfg.Setting.img+res.data.sm_z
				  that.s11=res.data.sm_z
			 }
			 if(res.data.sm_f)
			 {
				
				that.s2= Cfg.Setting.img+res.data.sm_f 
				that.s22=res.data.sm_f 
			 }
			}
		});
	},
	methods: {
		
		login() {
			var that = this;
		     
					if(!that.s11 ||  !that.s22 ||  !that.name ||  !that.card)
					{
						that.Msg.Fail('请输入完整信息');
						return
					}
				
				
				
				that.Net._get('smsh1',{s1:that.s11,s2:that.s22,name:that.name,card:that.card},(res)=>{
					if(res.code ==1){
					
						that.Msg.Success('提交成功',(res)=>{
						that.Nav._to({url:'/pages/personal/personal',type:2})
						})
					}
				});
				
		},
	openImg1() {
		let me = this;
		
		            //console.log('用户点击确定');
					uni.chooseImage({
						count: 1, //默认9
						
						sizeType: ['original', 'compressed'], //可以指定是原图还是压缩图，默认二者都有
						sourceType: ['album'], //从相册选择
						success: function(chooseImageRes) {
							const tempFilePaths = chooseImageRes.tempFilePaths
							pathToBase64(tempFilePaths[0])
													.then(base64 => {
													 
														me.Net._post('upAvatara1',{avatar:base64,t:1},(res)=>{
															if(res.code ==1){
															me.s1=Cfg.Setting.img+res.data
															me.s11=res.data	
															}
														});
													 })
													 .catch(error => {
													 });
											
						}
					});
		
	
	},
	openImg2() {
		let me = this;
		
		     
		            //console.log('用户点击确定');
					uni.chooseImage({
						count: 1, //默认9
						
						sizeType: ['original', 'compressed'], //可以指定是原图还是压缩图，默认二者都有
						sourceType: ['album'], //从相册选择
						success: function(chooseImageRes) {
							const tempFilePaths = chooseImageRes.tempFilePaths
							pathToBase64(tempFilePaths[0])
													.then(base64 => {
													 
														me.Net._post('upAvatara1',{avatar:base64,t:2},(res)=>{
															if(res.code ==1){
															me.s2=Cfg.Setting.img+res.data
															me.s22=res.data
															}
														});
													 })
													 .catch(error => {
													 });
											
						}
					});
					
					
		       
		    
		
	
	},	
	}
};
</script>

<style>
	page{
		padding-top: 20px;
		background-color: #f8f8f8;
	}
	.content{
	  width: 100%;
	  margin-top: 10px;
	  background-color: #fff;
	  padding-bottom: 10px;
	}
	
	.content .title{
	  width: 100%;
	  height: 40px;
	  line-height: 40px;
	  font-size: 14px;
	  color: #333;
	  text-indent: 16px;
	}
	
	.content .img01{
	  padding: 20px 0;
	  width: calc(100% - 32px);
	  margin-left: 16px;
	  background: #f5f5f5;
	  text-align: center;
	}
	
	.content .img01 image{
	  width: 30%;
	}
	
	.content .menu{
	  width: calc(100% - 32px);
	  margin-left: 16px;
	  height: 30px;
	  text-align: center;
	  line-height: 30px;
	  font-size: 14px;
	  color: #fff;
	  background-color: #4d726f;
	  border-radius: 0 0 10px 10px;
	}
	
	.content .sfz_box{
	  width: calc(100% - 32px);
	  margin-left: 16px;
	  display: flex;
	}
	
	.content .sfz_box .sfz{
	  width: calc(50% - 8px);
	  background-color: #f5f5f5;
	  text-align: center;
	}
	
	.content .sfz_box .sfz:nth-child(1){
	  margin-right: 16px;
	}
	
	.content .sfz_box .sfz image{
	  width: 70%;
	  height: 80px;
	  margin: 10px 0 5px 0;
	}
	
	.content .sfz_box .sfz .menu02{
	  width: 100%;
	  height: 30px;
	  text-align: center;
	  line-height: 30px;
	  font-size: 14px;
	  color: #fff;
	  background-color: #4d726f;
	  border-radius: 0 0 10px 10px;
	}
	
	.input_list{
		width: 100%;
		height: 50px;
		position: relative;
		background-color: #fff;
		margin-bottom: 1px;
	}
	
	.input_list .text{
		font-size: 3.5vw;
		color: #333;
		line-height: 50px;
		position: absolute;
		left: 10px;
	}
	
	.input_list input{
		font-size: 3.2vw;
		color: #333;
		line-height: 50px;
		height: 50px;
		position: absolute;
		right: 10px;
		text-align: right;
	}
	
	.tips{
		width: 100%;
		text-indent: 3%;
		line-height: 40px;
		font-size: 12px;
		color: #BEBEBE;
	}



</style>
